<template>
	<view class="main-big-box">
		<view class="big-search">
			<view class="search">
				<u-search placeholder="搜索" v-model="keyword" @change="search" :show-action="false" bg-color="#fff">
				</u-search>
			</view>
		</view>
		<view class="main">
			<view class="content">
				<view class="small-content" v-for="(item,index) in search()" :key="index">
					<view class="small-top">
						<view class="text-first">
							<view class="first-newline-a">
								<span>{{item.name}}</span>
							</view>
							<!-- <view class="first-newline-b">
								<u-icon name="clock"></u-icon>
								<span class="time">{{item.createTime}}</span>
							</view> -->
						</view>
						<view class="text-second">
							<view class="second-newline-a">
								<span>车号：</span><span>{{item.erpTrainNo}}</span>
							</view>
							<view class="second-newline-b">
								<span>车型：</span><span>{{item.trainModel.name}}</span>
							</view>
						</view>
						<view class="text-third">
							<view class="third-newline-a"><span>状态：</span><span>{{item.productionState}}</span></view>
							<view class="third-newline-b"><span>确认：</span><span class="blue">未确认</span></view>
						</view>
					</view>
					<view class="small-bottom" @click="goDetails(item)">
						<view class="center">
							<u-icon name="checkbox-mark"></u-icon>
							<span>现车标识确认</span>
						</view>
					</view>
				</view>
			</view>
			<view v-if="this.allListItem==true" class="ending">
				没有更多数据了
			</view>
		</view>
	</view>
</template>

<script>
	import {
		PlanApi
	} from "./api/index.js";
	export default {
		data() {
			return {
				timeSubstr: "", //截取时间
				keyword: '',
				pageNum:0,//请求页数
				pageSize:10,//请求个数
				allListItem:false,//控制请求所有
				total:'',//总数(后台)
				// allTotal:'',//总数（请求来的）
				dataList: [],
				// filters: {
				// 	state: '0',
				// 	trainNo: '',
				// 	productionState: 'NOT_BEGIN'
				// },


			}
		},
		onLoad() {

		},
		created() {
			this.getList();
			console.log(this.pageNum);
			// this.$http.get('/api/news',{
			// 	params:{
			// 		pageNum:this.pageNum,
			// 		pageSize:this.pageSize,
			// 	}
			// }).then(res=>{
			// 	console.log(res);
			// 	this.totalElements = res.data.total	

			// 		console.log(this.totalElements);
			// 		console.log(res.data);
			// 	console.log(res.data.list);
			// 	// this.dataList=res.data.List
			// 	let aaa = res.data.list
			// 	// console.log(aaa);
			// 	this.dataList = aaa
			// 	console.log(this.dataList);
			// })
		},
		onReachBottom() {
			// console.log(11111);
			// this.pageSize=this.pageSize+10
			// console.log(this);
			var allTotal = (this.pageNum+1) * this.pageSize
			// console.log(this.pageNum);
			// console.log(this.pageSize);	
			// console.log(allTotal);
			// console.log(this.total);
			// console.log(allTotal);
			// console.log(this.totalElements);
			if(allTotal < this.total) {
				this.allListItem =  false;
				this.pageNum ++;
				
				this.GetMoreCdcAccountList()
			} else {
				this.allListItem = true;
				console.log('已加载全部数据')
			}
		},
		methods: {
			// buildSearch(para) {
			// 	if (this.filters.trainNo) {
			// 		para.trainNo = this.filters.trainNo;
			// 	}
			// 	if (this.filters.productionState) {
			// 		console.log(para);
			// 		para['productionState'] = this.filters.productionState;
			// 	}
			// 	para.showState = this.filters.state;
			// 	return para;
			// },
			getList() {
				let params = {
					page: this.pageNum,
					size: this.pageSize,
					identifyCheckFlag:1,
					// productionState: "NOT_BEGIN",
					// showState: "0",
					// sort: "id,desc",
				}
				// console.log(params);
				// let para = this.buildSearch(params);
				PlanApi.list(params).then(res => {
					console.log(params);
					console.log(res);
					res.data.content.forEach((item, index) => {
						// console.log(item.createTime.length);
						// this.timeSubstr = item.createTime.substr(0, 16)
						item.createTime = item.createTime.substr(0, 16)
						// console.log(item.createTime.substr(0,16));
						let str = ()=>{
							switch (item.productionState) {
								case 'NOT_BEGIN':
									return 'ERP开工';
								case 'BREAK_FINISHED':
									return '制动解体完工';
								case 'ABRASIVE_FINISHED':
									return '抛丸完工';
								case 'DECOMPOSE':
									return '解体开工';
								case 'RATING':
									return '已评级';
								case 'SCHEDULE_PRESET':
									return '已分车';
								case 'SCHEDULE_CONFIRM':
									return '钢结构开工';
								case 'STEELY_FINISHED':
									return '钢结构完工';
								case 'PAINT_START':
									return '油漆开工';
								case 'ASSEMBLY_PROCESS':
									return '总装完工';
							}
						}
							
						item.productionState = str()
					})
					this.dataList = res.data.content;
					// let data = res.data;
					// let list = data.content;
					this.total = res.data.totalElements;
					// console.log(this.total);
					// this.allTotal = res.data.numberOfElements
				})
			},
			goDetails(item) {
				console.log(item);
				uni.redirectTo({
					url: `../details/details?id=${item.id}&name=${item.name}&productionState=${item.productionState}&trainNo=${item.trainNo}&code=${item.trainModel.code}&idSpe=${item.trainModel.id}`
				})
			},
			GetMoreCdcAccountList() {
				//  console.log("请求更多数据");
				//  this.$http.get('/api/news',{
				//   params:{
				//   	pageNum:this.pageNum,
				//   	pageSize:this.pageSize,
				//   }
				//  }).then(res=>{
				//   console.log(res);
				//   var bbb = res.data.list
				//   console.log(bbb);
				//   bbb.forEach((item)=>{
				// 	    this.dataList.push(item)
				//   })

				//   console.log(this.dataList);
				//  })
				let params = {
					page: this.pageNum,
					size: this.pageSize,
					identifyCheckFlag:1,
					// productionState: "NOT_BEGIN",
					// showState: "0",
					// sort: "id,desc",
				}
				// let para = this.buildSearch(params);
				PlanApi.list(params).then(res => {
					console.log(params);
					let moreList = res.data.content
					moreList.forEach((item,index)=>{
						item.createTime = item.createTime.substr(0, 16)
						let str = ()=>{
							switch (item.productionState) {
								case 'NOT_BEGIN':
									return 'ERP开工';
								case 'BREAK_FINISHED':
									return '制动解体完工';
								case 'ABRASIVE_FINISHED':
									return '抛丸完工';
								case 'DECOMPOSE':
									return '解体开工';
								case 'RATING':
									return '已评级';
								case 'SCHEDULE_PRESET':
									return '已分车';
								case 'SCHEDULE_CONFIRM':
									return '钢结构开工';
								case 'STEELY_FINISHED':
									return '钢结构完工';
								case 'PAINT_START':
									return '油漆开工';
								case 'ASSEMBLY_PROCESS':
									return '总装完工';
							}
						}
							
						item.productionState = str()
						this.dataList.push(item)
					})
					
				})
			},

			search() {
				// console.log(this.dataList);
				return this.dataList.filter(item => item.erpTrainNo.includes(this.keyword))

			},
		}

	}
</script>

<style lang="scss" scoped>
	.main-big-box {
		background-color: #efefef;
		// height: 1700rpx;
		overflow: hidden;
	}

	.main {
		// width: 100%;
		// height: 1048rpx;
		height: calc(100vh - 280rpx);
		overflow: scroll;
		background-color: #efefef;
		// padding-bottom: 100rpx;
	}

	.big-search {
		height: 100rpx;
		background-color: #efefef;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		padding: 0rpx 20rpx;

	}

	.search {
		margin: auto;
		line-height: 96rpx;
		// width: 94%;
		height: 35rpx;
	}

	.content {
		padding: 2rpx 22rpx;

	}

	.clock {
		width: 24rpx;
		height: 24rpx;
	}

	.small-content {
		// width: 96%;
		// height: 280rpx;
		margin: 20rpx auto;
		background-color: #fff;
		border-radius: 10px;
	}

	.small-top {
		padding-top: 36rpx;
	}

	.text-first {
		display: flex;
		justify-content: space-between;
		font-size: 30rpx;
		color: #999999;

	}

	.text-first {
		padding: 10rpx 32rpx;
	}

	.text-second,
	.text-third {
		display: flex;
		justify-content: space-between;
		font-size: 30rpx;
		color: #999999;
	}

	.text-second {
		padding: 10rpx 120rpx 10rpx 32rpx;
	}

	.text-third {
		padding: 4rpx 106rpx 24rpx 32rpx;
	}

	.blue {
		color: #0079FE;
	}

	.small-bottom {
		border-top: 1px solid;
		border-color: rgba(242, 242, 242, 1);
		// width: 60%;
		// margin: auto;
		text-align: center;
		line-height: 64rpx;
		color: #0079FE;
		padding: 10rpx 0;
		font-size: 30rpx;
	}

	.small-bottom:hover {
		cursor: pointer;
	}

	.center>span {
		margin-left: 10rpx;
	}

	.time {
		margin-left: 10rpx;
	}

	.first-newline-a {
		width: 600rpx;
	}

	.first-newline-b {
		width: 294rpx;
	}

	.second-newline-a {
		width: 260rpx;
	}

	.second-newline-b {
		width: 200rpx;
	}

	.third-newline-a {
		width: 270rpx;
	}

	.third-newline-b {
		width: 212rpx;
	}
	.ending {
		font-size: 34rpx;
		text-align: center;
		color: #dedede;
	}
</style>
